<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head> 
		<meta charset="UTF-8" />
		<title> 用户管理</title>
		<div th:replace="common/common_grid_header"></div>
	</head>
	<body>
		<fieldset class="layui-elem-field">
		    <div class="layui-field-box">
		        <div class="layui-inline">
		            <a class="layui-btn layui-btn-sm layui-btn-normal" data-type="addUser" id="add-disc"> <i class="layui-icon">&#xe61f;</i>新增</a>
		        </div>
		    </div>
		</fieldset>
		<div style="height: 100%">
			<div class="layui-row">
				<table class="layui-hide" id="LAY_table_user" lay-filter="user"></table> 
			</div>
		</div>
		
		<script type="text/html" id="toolBar">
			<a class="layui-btn layui-btn-xs" lay-event="permission">角色分配</a>
  			<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">编辑</a>
  			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
		</script>
		
		<script>
			layui.use('table', function(){
				var table = layui.table;
			  	
				//方法级渲染
				table.render({
					id:'dg_user',
				    elem: '#LAY_table_user',
				    url: '/system/org/user/listdata',
				    cols: [[
				      //{checkbox: true, fixed: true},
				      {field:'userid', align:'left', title: '登录名'}
				      ,{field:'userName', align:'left', title: '中文名',  sort: true}
				      ,{field:'sortNumber', align:'center', title: '排序'}
				      ,{fixed: 'right', width:200, align:'center', toolbar: '#toolBar'}
				    ]]
				    ,page: true
				    ,height: 500
				});
				
				//监听工具条
				table.on('tool(user)', function(obj){
				    var data = obj.data;
				    if(obj.event == 'detail'){
				      layer.msg('ID：'+ data.id + ' 的查看操作');
				    } else if(obj.event == 'del'){
				      	layer.confirm('确认要删除吗，删除后不能恢复',{
				      		offset:'10%',
							shade: 0.1
				      	}, function(index){
				        	//发送删除请求
				        	$.post("/system/org/user/delete",{id:data.id},function(res){
				        		if(res.success){
				        			obj.del();	
				        			layer.msg(res.msg);
				        		}else{
				        			layer.msg(res.msg, function(){});
				        		}
				        		layer.close(index);
				            },"json");
				      	});
				    } else if(obj.event == 'edit'){
				    	layer.open({
							title : [ '用户信息','font-size:18px;text-align:center;padding:0' ],
							type : 2,
							area : [ '600px', '406px' ],
							offset:'10%',
							shade: 0.1,
							content : [ "/system/org/user/edit/"+data.id, 'no' ]
						});
				    } else if(obj.event == 'permission'){
				    	layer.open({
							title : [ '角色分配','font-size:18px;text-align:center;padding:0' ],
							type : 2,
							area : [ '600px', '406px' ],
							offset:'10%',
							shade: 0.1,
							content : [ "/system/org/role/assign/"+data.userid, 'no' ]
						});
				    }
				});
				  
				$('.demoTable .layui-btn').on('click', function(){
				    var type = $(this).data('type');
				    active[type] ? active[type].call(this) : '';
				});
			});
			
			
			$(function() {
				layui.use([ 'element', 'table', 'layer' ], function() {
					var element = layui.element;
				});
				
				//弹出框
				$("#add-disc").on("click",function() {
					layer.open({
						title : [ '用户信息','font-size:18px;text-align:center;padding:0' ],
						type : 2,
						area : [ '600px', '436px' ],
						offset:'10%',
						shade: 0.1,
						content : [ "/system/org/user/add", 'no' ]
					});
				})
				
			})
			
		</script>
	</body>
</html>